import {action, observable } from "mobx";
import page from '../apis/page';
import { displayTypes } from '../constants/app';

export default class SettingDesignerStore {
    @observable type = 'rule';
    @observable appid = '';
    @observable formLinks = [];
    @observable displayType = 'FORM';
    @observable addFieldsUrl = '';

    @action changeType = (type) => {
        this.type = type;
    }

    @action init = (appid) => {
        this.appid = appid;
        const parent = this.parent();
        const {app} = parent;
        this.displayType = app.displayType;
        if(app.displayType === displayTypes.FORM){
            page.getExtendAttr(appid).then(res => {
                if(res) {
                    this.formLinks = JSON.parse(res);
                }
            });
        } else {
            this.type = 'tasksetting';
        }
    }

    @action addExtendLink = (link, index) => {
        this.formLinks.splice(index, 1, link);
        this.changeFormLinks();   
    }

    @action onFormLinksChange = formLinks => {
        this.formLinks = formLinks || [];
        this.changeFormLinks(); 
    }

    @action changeAddFieldsUrl = url => {
        this.addFieldsUrl = url;
    }

    changeFormLinks = () => {
        page.setExtendAttr({
            appid: this.appid,
            config: JSON.stringify(this.formLinks)
        });
    }
}